<?php
header('content-type:text/html;charset=utf8');
require_once "../config.php";
require_once "../functions.php";

checkLogin();
?>
<!DOCTYPE html>
<html lang="zh-CN">
<head>
  <meta charset="utf-8">
  <title>Comments &laquo; Admin</title>
  <link rel="stylesheet" href="../static/assets/vendors/bootstrap/css/bootstrap.css">
  <link rel="stylesheet" href="../static/assets/vendors/font-awesome/css/font-awesome.css">
  <link rel="stylesheet" href="../static/assets/css/admin.css">
</head>
<body>

  <div class="main">
    <?php 
      $current_page = 'comments';
    ?>
    <?php include_once "./public/_navbar.php" ?>
    <div class="container-fluid">
      <div class="page-title">
        <h1>所有评论</h1>
      </div>
      <!-- 有错误信息时展示 -->
      <!-- <div class="alert alert-danger">
        <strong>错误！</strong>发生XXX错误
      </div> -->
      <div class="page-action">
        <!-- show when multiple checked -->
        <div class="btn-batch" style="display: none">
          <button class="btn btn-info btn-sm">批量批准</button>
          <button class="btn btn-warning btn-sm">批量拒绝</button>
          <button class="btn btn-danger btn-sm">批量删除</button>
        </div>
        <ul class="pagination pagination-sm pull-right" id="pagination-demo">
          <!-- <li><a href="#">上一页</a></li>
          <li><a href="#">1</a></li>
          <li><a href="#">2</a></li>
          <li><a href="#">3</a></li>
          <li><a href="#">下一页</a></li> -->
        </ul>
      </div>
      <table class="table table-striped table-bordered table-hover">
        <thead>
          <tr>
            <th class="text-center" width="40"><input type="checkbox"></th>
            <th>作者</th>
            <th>评论</th>
            <th>评论在</th>
            <th>提交于</th>
            <th>状态</th>
            <th class="text-center" width="100">操作</th>
          </tr>
        </thead>
        <tbody>
          
        </tbody>
      </table>
    </div>
  </div>

  <?php include_once "./public/_aside.php"; ?>

  <script src="../static/assets/vendors/jquery/jquery.js"></script>
  <script src="../static/assets/vendors/bootstrap/js/bootstrap.js"></script>
  <script src="../static/assets/vendors/art-template/template-web.js"></script>
  <script type="text/template" id="tpl">
  {{each data}}
    <tr>
      <td class="text-center"><input type="checkbox"></td>
      <td>{{$value.author}}</td>
      <td>{{$value.content}}</td>
      <td>{{$value.title}}</td>
      <td>{{$value.created}}</td>
      <td>{{$value.status=="rejected"?'未批准':'已批准'}}</td>
      <td class="text-center">
        <a href="post-add.php" class="btn btn-warning btn-xs">驳回</a>
        <a href="javascript:;" class="btn btn-danger btn-xs">删除</a>
      </td>
    </tr>
  {{/each}}
  </script>
  <script src="../static/assets/vendors/twbs-pagination/jquery.twbsPagination.js"></script>
  <script>
    $(function(){
      //声明变量表示当前是第几页 以及 每页取多少条数据
      var currentPage = 1;
      var pageSize = 10;
      var pageCount;
      function getCommentsData(){
        $.ajax({
        type: "post",
        url: "api/_getCommentsData.php",
        data: {currentPage:currentPage,pageSize:pageSize},
        dataType: "json",
        success: function (res) {
         if(res.code == 1){
            pageCount = res.pageCount;
            var html = template('tpl',res);
            // console.log(html);
            $('tbody').html(html);
               //分页插件
        //先引入插件 twbs-pagination
        //使用样式，可以是bootstrap提供的样式，也可以是自己的样式
        //要有一个可以调用的标签，可以是ul,也可以是div 
        //调用twbsPagination完成分页效果
      $('#pagination-demo').twbsPagination({
        totalPages:pageCount,//最大页码
        visiblePages:7,//总共显示多少个分页按钮
        onPageClick:function(event,page){//点击每个分页按钮的时候执行的操作
          // $('#page-content').text('page ' + page);
          // console.log(111);
          // console.log(page);
          currentPage = page;
          getCommentsData();
        }
      });
         }
        }
        });
      }

      getCommentsData();
      
   
    })
  </script>
</body>
</html>
